<template>
	<view class="flex-column h100">
		<!-- #ifndef MP-TOUTIAO -->
		<uni-nav-bar height="80rpx" :statusBar='true' title="搜索"></uni-nav-bar>
		<!-- #endif -->
		<view class="padding-cross-10 margin-vertical-10">
			<u-search bgColor="#dfdfdf" :showAction="false" placeholder="搜索好友或者帖子" v-model="username"></u-search>
		</view>
<!-- 		<view class="flex center flex1">
			<text>下个版本开放搜索和推荐帖子功能</text>
		</view> -->
		<view class="flex" style="row-gap: 4rpx;flex-wrap: wrap;">
			<view v-for="(item,index) in datas.slice(0,15)" :key="item.edge_id" :style="{width:width,height:width}" @click="jump(item)" style="padding-left: 4rpx;">
				<image v-if="isVideo(item)" :lazy-load="true" :src="transPic(item)" class="image-cover" :style="{width:width,height:width}"></image>
				<video v-else :show-fullscreen-btn="false" :muted="true" :show-center-play-btn="false" :show-play-btn="false" :controls="false" :autoplay="true" :loop="true" :src="transPic(item)" :style="{width:width,height:width}"></video>
			</view>
			<view style="width: 100vw;" v-if="datas.length >= 15">
				<ad unit-id="adunit-e152689988be9a8e" ad-type="video" ad-theme="white"></ad>
			</view>
			<view v-if="datas.length > 15" v-for="(item,index) in datas.slice(15)" :key="item.edge_id" :style="{width:width,height:width}" @click="jump(item)" style="padding-left: 4rpx;">
				<image v-if="isVideo(item)" :lazy-load="true" :src="transPic(item)" class="image-cover" :style="{width:width,height:width}"></image>
				<video v-else :show-fullscreen-btn="false" :muted="true" :show-center-play-btn="false" :show-play-btn="false" :controls="false" :autoplay="true" :loop="true" :src="transPic(item)" :style="{width:width,height:width}"></video>
			</view>
		</view>
		<view v-if="isend" class="flex center">
			<text>没有更多了</text>
		</view>
	</view>
</template>

<script>
	import Config from "@/common/config.js"
import { getMedias } from "../../api/app/api";
	export default{
		data(){
			return {
				datas:[],
				width:0,
				start:0,
				isend:false
			}
		},
		methods:{
			async loadData(){
				uni.showLoading({
					title:"正在加载数据"
				})
				let response = await getMedias({
					fnName:'quickstartFunctions',
					data:{
						type: "getUserEdge",
						collectionName: "user_edge",
						start: this.start,
						isVideo: false,
					}
				})
				let datas = JSON.parse(response.data)['data']
				this.datas.push(...datas)
				if (datas.length<15){
					this.isend = true
				}
				this.start = this.start + 1
				uni.hideLoading()
			},
			transPic(val){
				if(val.origin == 'mp-toutiao'){
					return val.display_url
				}
				let src = val.origin == 'wx' ? val.display_url : Config.base_Url + 'ins_img/' + val.shortcode + (val.is_video ?  '.mp4' : '.jpg')
				// if(src.includes('cloud')){
				// 	let das = src.split('/')
				// 	console.log(das)
				// 	return Config.static_url + das[das.length-1]
				// }
				if(val)
				return src;
			},
			isVideo(val){
				return val.origin == 'ins' ? !val.is_video : !val.display_url.includes('.mp4');
			},
			jump(item){
				console.log(item)
				let id = item?.edge_id || item.id;
				uni.navigateTo({
				  url: `/subA/detail/detail?edgeId=${item.shortcode}&shortCode=${id}&isUser=true&isSearch=true`,
				success:(res)=>{
					res.eventChannel.emit("transformData", item);
				}
				});
			}
		},
		async onLoad(){
			this.width = (this.$store.getters.getsysteminfo.screenWidth / 3.07) + 'px'
			this.loadData()
		},
		onReachBottom(){
			if(this.isend){
				uni.showToast({
					title:"没有更多了",
					icon:"error",
					duration:1000
				})
			}else{
				console.log("onReachBottom");
				this.loadData()
			}

		},
	}
</script>

<style>
</style>